<template>
	<div class="register">
		<div class="loginBox">
			<image class="logo" src="https://www.baixuemianshi.com/zhuanti/images/logo_squer_xcx.jpg" mode="widthFix"></image>
			<div class="text">快捷登录</div>
			<div class="flexBox">
				<u-button type="error" open-type="getPhoneNumber" @getphonenumber="getPhoneNum">手机号快捷登录</u-button>

			</div>

			<div class="out" @click="out()">暂不登录</div>
		</div>

		<div class="popup" v-if="showPrivacy">
			<div class="popcontent">
				<view class="privacyTit">用户隐私保护提示</view>
				<div class="poptext">感谢您的使用，在使用本小程序前，应当阅读并同意<text
						@click="handleOpenPrivacyContract">《用户隐私保护指引》</text>。当您点击同意并开始使用程序服务时，即表示您已理解并同意该条款内容，该条款将对您产生法律约束力。如您拒绝，将无法进入小程序。</div>
				<div class="btns">
					<div class="btn"><u-button shape="circle"  @tap="showPrivacy = false">不同意并退出</u-button></div>
					<div class="btn"><u-button type="error" shape="circle"  id="agree-btn" open-type="agreePrivacyAuthorization" @click="handleAgreePrivacyAuthorization">同意并继续</u-button></div>
				</div>
			</div>
		</div>

		<div class="bgBox" :style="style"></div>




	</div>
</template>


<script>
	const db = wx.cloud.database()
	import {
		mapActions
	} from 'vuex';
	export default {
		data() {
			return {
				haslogin: false, //是否已登录
				name: '',
				bgList: ['http://www.baixuemianshi.com/zhuanti/xcx/1.jpg',
					'http://www.baixuemianshi.com/zhuanti/xcx/2.jpg', 'http://www.baixuemianshi.com/zhuanti/xcx/3.jpg'
				],
				style: {},
				index: 0,
				navTlt: '登录页',

				showPrivacy: false,
				showLoading:false
			};
		},
		onLoad(options) {
			if (!options) {
				this.infoScene = 'default';
			} else {
				this.name = options.name
				this.navTlt = options.navTlt
			}

			if (wx.getPrivacySetting) {
				wx.getPrivacySetting({
					success: res => {
						console.log(res) // 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' }
						if (res.needAuthorization) {
							// 需要弹出隐私协议
							this.showPrivacy = true
						} else {
							// 用户已经同意过隐私协议，所以不需要再弹出隐私协议，也能调用已声明过的隐私接口
							// wx.getUserProfile()
							// wx.chooseMedia()
							// wx.getClipboardData()
							// wx.startRecord()
						}
					},
					fail: () => {},
					complete: () => {}
				})
			}
			
		
		
	},
	computed: {
			userphone() {
				return this.$store.getters.userphone ? this.$store.getters.userphone : '';
			},
			username() {
				return this.$store.getters.username ? this.$store.getters.username : '';
			}

		},
		mounted() {
			let that = this
			that.changeBg()
			setInterval(() => {
				that.changeBg()
			}, 5000)

			this.name = this.name ? this.name : this.username;
			this.LogSetName(this.name);

		},
		watch: {
			userphone(val) {
				console.log(this.userphone)
			}
		},

		created() {
			let that = this;

		},
		methods: {
			...mapActions(['LogSetPhone', 'LogSetName', 'LogSetOpenid']),
			getPhoneNum(e) {
				var that = this;
				uni.showToast({
					icon:"loading",
					title:"请等待"
				})
				if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
					console.log('用户取消授权');
				} else {
					uni.login({
						provider: 'weixin',
						success: function(loginRes) {
							console.log(loginRes)
							wx.cloud.callFunction({
								name: 'getuser',
								data: {
									encryptedData: e.detail.encryptedData,
									iv: e.detail.iv,
									code: loginRes.code,
									cloudID: wx.cloud.CloudID(e.detail.cloudID)
								},
								success: res => {
									console.log(res)
									let uPhone = res.result.event.cloudID.data.phoneNumber
									let openId = res.result.openId
									that.LogSetPhone(uPhone)
									that.LogSetOpenid(openId)
									that.submitePhone(uPhone, openId)
								},
								fail: req => {
									console.log(req)
								}
							});
						},
						fail(err) {
							uni.showToast({
								icon: 'none',
								title: '授权失败！'
							});
						}
					});
				}
			},
			submitePhone(phone, openId) {
				let that = this
				db.collection('all_user').add({
					data: {
						phone: phone,
						openId: openId,
						user: that.name,
						nickname: "",
						avatarUrl: "",
						activity: that.navTlt,
						time: new Date()
					},
					success: function(res) {
						that.showToast('success', '登录成功')
					},
					complete: function(req) {
						that.loginSuccess()
					},
				})

			},
			loginSuccess() {
				var that = this;
				that.out()
			},
			out() {
				let pages = getCurrentPages();
				if (pages.length == 1) {
					uni.switchTab({
						url: '/pages/index/index'
					});
				} else {
					uni.navigateBack(1);
				}
			},
			contactus() {
				wx.makePhoneCall({
					phoneNumber: '18045107677'
				});
			},
			
			handleAgreePrivacyAuthorization() {
				this.showPrivacy = false
			},
			handleOpenPrivacyContract() {
				// 打开隐私协议页面
				wx.openPrivacyContract({
					success: () => {}, // 打开成功
					fail: () => {}, // 打开失败
					complete: () => {}
				})
			},

			changeBg() {
				if (this.index >= this.bgList.length - 1) {
					this.index = 0
				} else {
					this.index += 1
				}
				this.style = "background-image: url(" + this.bgList[this.index] + ")"

			},
			changePath(path) {
				let that = this;
				uni.navigateTo({
					url: path
				});
			},

		}
	};
</script>

<style>
	@import url(./index.css);
</style>